<template>
	<view>
		<cu-custom bgColor="bg-gradual-blue" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">授权</block>
		</cu-custom>

		<!--登录图标-->
		<view class="zaiui-user-login-avatar-view">
			<view class="cu-avatar round lg" style="background-image:url(https://kshht.gzmsdw.cn/imge_zsyy/html/my/mine_def_touxiang_3x.png);" />
		</view>

		<!--按钮-->
		<view class="flex flex-direction zaiui-btn-view">
			<button @click="getUserInfo" :loading="loginLoading" :class="loginLoading ? 'loginLoading' : ''" style="height: 70rpx;" class="cu-btn bg-blue cuIcon-weixin">
				<text class="padding-left-sm">微信一键登陆</text>
			</button>
		</view>

		<!--协议-->
		<!-- <view class="zaiui-agreement-checked-view">
			<checkbox :checked="readState" @click="readState = !readState" style="margin-top: 20rpx;" class="round red sm zaiui-checked checked" />
			<view class="text-sm text-black-view">
				<view class="text-gray">已阅读并同意以下协议</view>
				<view class="text-blue">《贵达物流用户服务协议》《贵达物流隐私政策》</view>
			</view>
		</view> -->

		<!--底部说明-->
		<!-- <view class="text-sm text-gray zaiui-foot-ad-view">贵达物流从“心”出发，值得托付。</view> -->

		<view class="cu-modal" :class="showAuthorizeModal ? 'show' : ''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white justify-end">
					<view class="content">授权提示</view>
					<view class="action" @tap="hideModal"><text class="cuIcon-close text-blue"></text></view>
				</view>
				<view class="padding-sm">还未授权必要权限，请授权。</view>
				<view class="padding-sm">
					<button @click="requestSubscribeMessage" class="cu-btn bg-red w-100" :class="subscriptionState ? 'cuIcon-check bg-green' : 'cuIcon-close bg-red'">
						<text class="padding-left-sm">订阅订单状态通知</text>
					</button>
				</view>
			</view>
		</view>

		<u-toast ref="uToast" />
	</view>
</template>

<script>
export default {
	data() {
		return {
			readState: false,
			loginLoading: false,
			isLogin: false,
			showAuthorizeModal: false,
			subscriptionState: false,
			phoneState: false
		};
	},
	onLoad() {},
	methods: {
		logout() {
			this.$api.logout({
				success: res => {
					console.log(res);
				}
			});
		},
		hideModal(e) {
			this.showAuthorizeModal = false;
		},
		getUserInfo(e) {
			/*if (!this.readState) {
				this.$refs.uToast.show({
					title: '请先勾选同意协议',
					type: 'error',
					position: 'top'
				});
				return;
			}*/
			this.loginLoading = true;
			uni.getUserProfile({
				desc: '登录',
				success: result => {
					uni.login({
						provider: 'weixin',
						success: res => {
							console.log(res.code);
							this.login(res.code, result.userInfo);
						}
					});
				},
				fail: err => {
					this.$refs.uToast.show({
						title: '你取消了授权，登录失败',
						type: 'error',
						position: 'top'
					});
					this.loginLoading = false;
				}
			});
		},
		login(code, userInfo) {
			this.$api.wxLogin({
				data: {
					code
				},
				success: res => {
					console.log(res, userInfo);
					if (parseInt(res.data.code) == 200) {
						userInfo.token = res.data.data.token;
						userInfo.id = res.data.data.id;
						this.isLogin = true;
						this.$refs.uToast.show({
							title: '登录成功',
							type: 'success',
							position: 'top'
						});
						uni.setStorageSync('userInfo', userInfo);
						this.$api.syncUserInfo({
							data: userInfo,
							header: {
								json: true
							},
							success: res => {
								userInfo.lastVisitTime = res.data.data.lastVisitTime;
								userInfo.createTime = res.data.data.createTime;
								userInfo.openid = res.data.data.openid;
								uni.setStorageSync('userInfo', userInfo);
							},
							complete: () => {}
						});
						//this.showAuthorizeModal = true;
						uni.navigateBack();
					} else {
						this.$refs.uToast.show({
							title: res.data.msg,
							type: 'error',
							position: 'top'
						});
					}
				},
				complete: data => {}
			});
		},
		requestSubscribeMessage() {
			var tmplIds = ['91ckQnTHLeU5zrt08mNXSLarFy5a8B-VNSyJZA2xGWQ'];
			wx.getSetting({
				withSubscriptions: true, //  这里设置为true,下面才会返回mainSwitch
				success: res => {
					// 调起授权界面弹窗
					if (res.subscriptionsSetting.mainSwitch) {
						// 用户打开了订阅消息总开关
						if (res.subscriptionsSetting.itemSettings != null) {
							console.log(res.subscriptionsSetting.itemSettings);
							// 用户同意总是保持是否推送消息的选择, 这里表示以后不会再拉起推送消息的授权
							let moIdState = res.subscriptionsSetting.itemSettings.tmplIds[0]; // 用户同意的消息模板id
							if (moIdState === 'accept') {
								console.log('接受了消息推送');
								this.subscriptionState = true;
							} else if (moIdState === 'reject') {
								console.log('拒绝消息推送');
							} else if (moIdState === 'ban') {
								console.log('已被后台封禁');
							}
						} else {
							// 当用户没有点击 ’总是保持以上选择，不再询问‘  按钮。那每次执到这都会拉起授权弹窗
							wx.showModal({
								title: '提示',
								content: '请授权开通服务通知',
								showCancel: true,
								success: ress => {
									if (ress.confirm) {
										wx.requestSubscribeMessage({
											// 调起消息订阅界面
											tmplIds,
											success: ret => {
												this.subscriptionState = true;
												var userInfo = uni.getStorageSync('userInfo');
												userInfo.subscriptionState = this.subscriptionState;
												uni.setStorageSync('userInfo', userInfo);
											},
											fail: rej => {
												console.log('订阅消息 失败 ');
												console.log(rej);
											}
										});
									}
								}
							});
						}
					} else {
						console.log('订阅消息未开启');
					}
				},
				fail: function(error) {
					console.log(error);
				}
			});
		}
	}
};
</script>

<style lang="scss">
.loginLoading {
	background-color: #005aa7;
}
.zaiui-user-login-avatar-view {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 218.18rpx;
	.cu-avatar {
		width: 181.81rpx;
		height: 181.81rpx;
	}
}
.zaiui-btn-view {
	position: relative;
	margin-top: 72.72rpx;
	padding: 0 45.45rpx;
	.cu-btn .icon {
		position: relative;
		font-size: 47.27rpx;
		right: 9.09rpx;
		top: -3.63rpx;
	}
}
.zaiui-agreement-checked-view {
	position: relative;
	padding: 27.27rpx 45.45rpx;
	.zaiui-checked {
		position: absolute;
		transform: scale(0.7);
	}
	.text-black-view {
		padding-left: 54.54rpx;
		line-height: 47.27rpx;
	}
}
.zaiui-foot-ad-view {
	position: fixed;
	text-align: center;
	bottom: 72.72rpx;
	width: 100%;
}
</style>
